<template>
  <content @submit="handleSubmit" ref="contentRef">
    <van-button  type="primary" native-type="submit" @click="debouncedSubmit" class="btn">
      提&nbsp;&nbsp;&nbsp;&nbsp;交
    </van-button>
    <van-button  type="warning" native-type="submit" @click="handleCancel" style="margin-left: 20px;"  class="btn">
      取&nbsp;&nbsp;&nbsp;&nbsp;消
    </van-button>
  </content>
</template>
<script setup lang="ts" name="Detail">
import Content from "./Content.vue";
import group from '../../api/group.ts'
import {ref} from "vue";
import {useRoute, useRouter} from "vue-router";
import {debounce} from "../../utils";
import {showNotify} from "vant";
const route = useRoute();
const router = useRouter();
const groupId = route.query.groupId as string;
const contentRef = ref<any>(null)
function handleSubmit(){
    const data = contentRef.value.getValue()
    group.add(data).then(() => {
      showNotify({type: "success", message: "新增成功"});
      router.push({path:'/tree',query:{groupId}})
    })
}
const debouncedSubmit = debounce(handleSubmit, 1000);
function handleCancel(){
  router.push({path:'/tree',query:{groupId}})
}
</script>
<style scoped>
.btn{
  width:100px;
  height: 30px;
}
</style>